<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>订单预览页面</title>
    <!--bootstrap-->
    <link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="../js/jquery.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="../bootstrap/js/bootstrap.min.js"></script>

    <script src="../js/HttpUtil.js"></script>

    <!--引入存到浏览器的js文件-->
    <script src="../js/UserCacheUtil.js"></script>

    <script src="../js/CartUtils.js"></script>

</head>
<body>
<!--<nav class="navbar navbar-default">
    <div class="container">

        &lt;!&ndash; ********  这个是品牌图标  ********** &ndash;&gt;

        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">品牌</a>
        </div>

        &lt;!&ndash; ********  这个是左边的链接  ********** &ndash;&gt;

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">帮助 <span class="sr-only">(current)</span></a></li>
                <li><a href="#">问题反馈</a></li>
            </ul>

            &lt;!&ndash; ********  这边是右边的链接  ********** &ndash;&gt;

        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">品牌</a>
        </div>

        &lt;!&ndash; ********  这个是左边的链接  ********** &ndash;&gt;

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">帮助 <span class="sr-only">(current)</span></a></li>
                <li><a href="#">问题反馈</a></li>
            </ul>

            &lt;!&ndash; ********  这边是右边的链接  ********** &ndash;&gt;
            <ul class="nav navbar-nav navbar-right">

                <li><a href="../user/user-sign-up.html">注册</a></li>
                <li><a href="../user/user-sign-in.html">登录</a></li>
                &lt;!&ndash; ******** 和注册登录互斥隐藏 ********  &ndash;&gt;
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                        <label id="label_user_name">
                            未登录
                        </label>
                        <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">个人信息</a></li>
                        <li><a href="#">地址管理</a></li>
                        <li><a href="../orders/order.html">订单管理</a></li>
                        <li><a href="#">退出</a></li>
                        &lt;!&ndash;                        <li><a href="#">Something else here</a></li>&ndash;&gt;
                        &lt;!&ndash;                        <li role="separator" class="divider"></li>&ndash;&gt;
                        &lt;!&ndash;                        <li><a href="#">Separated link</a></li>&ndash;&gt;
                    </ul>
                </li>
                <li><a href="cart.html">购物车</a></li>

            </ul>
        </div>&lt;!&ndash; /.navbar-collapse &ndash;&gt;
    </div>&lt;!&ndash; /.container-fluid &ndash;&gt;

</nav>-->
<!--导入页面公共头部-->
<div class="Top_header"></div>

<div class="container">
    <div class="row" style="margin-left: 40px">
        <h3>订单预览<small>温馨提示：请添加你要邮递到的地址</small></h3>
    </div>

    <div class="row"  style="margin-top: 40px;">
        <div class="col-md-10 col-md-offset-1" id="car-table">
            <table class="table table-bordered table-striped table-hover" id="div_carts_list">
                <tr>
                    <th>序号</th>
                    <th>商品名称</th>
                    <th>价格(元)</th>
                    <th>数量</th>
                    <th>小计(元)</th>
                </tr>
            </table>
        </div>



        <div class="row"  style="margin-top: 40px;">
            <div class="col-md-10 col-md-offset-1" id="car-table1">
                <table class="table table-bordered table-striped table-hover" id="div_carts_list1">
                    <tr>
                        <th>序号</th>
                        <th>收件人姓名</th>
                        <th>收件人电话号</th>
                        <th>详情地址</th>
                        <th>操作</th>
                    </tr>
                </table>
            </div>
            <!--        <div class="col-md-10 col-md-offset-1">
                        <table class="table table-bordered table-striped table-hover">
                            <tr>
                                <td colspan="5">
                                    <h5>收货地址</h5>
                                    <select id="address" style="width:60%" class="form-control">
                                        &lt;!&ndash;                            <option value="${a.a_id}"></option>&ndash;&gt;
                                    </select>
                                    &lt;!&ndash;  <a href="address?method=show">添加收货地址</a>&ndash;&gt;
                                </td>
                            </tr>
                        </table>
                    </div>-->

            <div class="row">
                <div class="pull-right" style="margin-right: 40px;">
                    <br><br>
                    <div style="margin-bottom: 20px;">
                        商品金额总计(元)：<span id="total" class="text-danger"><b id="s_sum"></b></span>
                    </div>
                </div>
            </div>

        </div>

    </div>
</div>

<script>
    $(function () {
        LoadCartInfo();
        loadUserInfo();
        LoadCartInfo1();
    });
    // 设置默认地址
    function f() {

    }
    function loadUserInfo() {
        let user = getLocalStorage("loginUser");
        console.log(user);
        // console.log($("#label_user_name"));
        $("#label_user_name").html(user.uName);
    }

    function LoadCartInfo() {
        //发起ajax请求
        let user1 = getLocalStorage("loginUser");
        /*       let url = "/cart/selectCart?userId=1&";*/
        let url = "/cart/selectCart";
        // 这里的userId一定要和后台接口属性对应上
        let params = {
            userId : user1.uId };
        console.log("1222222222221");
        httpGet(url,params,function (data) {
            //业务处理
            /*           renderingGoodsList(data);*/
            console.log("111111");
            console.log(data);
            // 通用页面渲染
            render(data);
        });
    }

    function LoadCartInfo1() {
        //发起ajax请求
        let user1 = getLocalStorage("loginUser");
        /*       let url = "/cart/selectCart?userId=1&";*/

        let url = "/address/info";
        // 这里的userId一定要和后台接口属性对应上
        let params = {
            uId : user1.uId
        };
        httpGet(url,params,function (data) {
            console.log(data);
            //业务处理
            /*           renderingGoodsList(data);*/
            // 通用页面渲染
            render1(data);
        });
    }

    // 点击提交订单调用接口后台生成订单消息
    $("#car-table1").on("click","#submitOrder",createOrder)
    function  createOrder(){
        // 对应后台生成接口
        /*       let url = */
        // 参数获取
        // 获取用户消息
        let uId = getLocalStorage("loginUser").uId;
        console.log(uId+"用户id拿到了");
        console.log(this);
        // 获取地址id
        let aId = $(this).parent().parent().find("#addaId").text();
        console.log(aId+"地址id拿到了");
        // 获取商品总价格
        let oCount = $("#s_sum").text();
        console.log(oCount+"总价格拿到了");
        // 发送ajax请求 (传递参数：1.用户ID 2.地址ID 3.购物车的总金额)
        $.ajax({
            url: '/shop-api/orders/addOrderByOid',  //调用增加订单信息的后端接口
            type: 'post',
            data: JSON.stringify({
                uId: uId,
                aId: aId,
                oCount: oCount
            }),
            contentType: "application/json",
            // ajax请求后端数据成功
            success: function () {

                console.log("将要跳转中订单页面");
                //跳转至订单页面(重定向)
                $(window).attr('location', '/shop-app/orders/order.html');
            }
        });
    }

    // 点击提交订单并清空该用户的购物车
    $("#car-table1").on("click","#submitOrder",clearCart)
    function clearCart(){
        let user1 = getLocalStorage("loginUser");
        let url = "/cart/clearCart";
        // 这里的userId一定要和后台接口属性对应上
        let params = {
            userId : user1.uId };
        httpGet(url, params ,function (data) {
            //业务处理
            /*            location.href = "cart.html";*/
        });
    }

</script>

<!-- 添加头header.html -->
<script>

    //等待页面加载完成，导入 header.html
    $(".Top_header").load('/shop-app/include/header.html');
</script>

</body>
</html>
